bootstrap table 分页显示问题 |
您所在的位置：网站首页 › bootstrap table分页跳转 › bootstrap table 分页显示问题 |
|
1.bootstrap-table客户端分页 客户端分页的数据源可以是后台服务器端传递过来（一次性获取，即获取所有你需要的数据),点击页码不再请求后台,利用页面缓存分页;cache : true, //是否使用缓存，默认为true $('#TableId').bootstrapTable({ url : '/adjustQueryController/getOAbudgetList.json', //请求后台的URL（*） method: 'GET', sidePagination : "client", //分页方式：client客户端分页，server服务端分页（*） pagination : true, //是否显示分页（*） queryParams : queryParams, //分页 pageSize : 10, //每页显示的记录数 pageNumber : 1, //当前第几页 pageList : [ 10, 25, 50, 100 ], //记录数可选列表 responseHandler: function(data){ return data.rows; //约定rows }, columns : [ {checkbox : true}, {title: '调整类型', field: 'adjustType', align: 'center'}, {title: '申请日期', field: 'applyDate', align: 'center'}, {title: '单据编号', field: 'processCode', align: 'center'}, {title: '调整组织', field: 'applyOrganization', align: 'center'}, {title: '调整部门', field: 'applyDepartment', align: 'center'}, {title: '是否涉及人力', field: 'flag', align: 'center'} ] }); @RequestMapping(value = "/getOAbudgetList", method = { RequestMethod.GET }) public String getOAbudgetList(HttpServletRequest request, HttpServletResponse response){ String processCode = request.getParameter("processCode"); String adjustType = request.getParameter("adjustType"); String adjOrg = request.getParameter("adjOrg"); String adjDepart = request.getParameter("adjDepart"); String adjSubject = request.getParameter("adjSubject"); List pageList = oaAdjustQueryService.findPageList(processCode,adjustType,adjOrg,adjDepart,adjSubject); int total = pageList.size(); String jsonStr = JSONArray.fromObject(pageList).toString(); String jsonString="{\"total\":"+total+",\"rows\":"+jsonStr+"}"; //约定rows return jsonString; }2.bootstrap-table服务端分页 服务端分页的数据源是后台服务器端传递过来的,每点击一次页码,将page、size发送给后台查询,返回页面数据 method: 'POST', contentType : "application/x-www-form-urlencoded", //必须有 sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*） pagination : true, //是否显示分页（*） queryParams : queryParams, //分页 pageSize : 10, //每页显示的记录数 pageNumber : 1, //当前第几页 pageList : [ 10, 25, 50, 100 ], //记录数可选列表queryParams : queryParams, //分页参数responseHandler : responseHandler,//响应数据cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）,区别客户端分页 function queryParams(params) { var batchId=[[${batchId}]]; //thymeleaf 页面获取单个数据 var str = { "page" : this.pageNumber, "pageSize" : this.pageSize, //需要传递page、size "filter" : { "filters" : [{ "field" : "budgetBatchId", "value" : batchId }] } }; var baseData = JSON.stringify(str); var param = { models : baseData } return param; }function responseHandler(res) { //spring data JPA中findAll()条件查询分页返回 if (res) { return { "rows" : res.list, "total" : res.total }; } else { return { "rows" : [], "total" : 0 }; } }; ------------------------ 学习链接: https://blog.csdn.net/mhmyqn/article/details/25561535
|
今日新闻 |
推荐新闻 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |